// 分类选择器交互逻辑
document.addEventListener('DOMContentLoaded', () => {
    const selector = document.getElementById('selector');
    const dropdown = document.getElementById('dropdown');
    let isOpen = false;

    // 初始化加载分类数据
    window.__TAURI__.invoke('load_categories')
        .then(categories => {
            dropdown.innerHTML = categories.map(cat => `
                <div class="option" data-id="${cat.id}">
                    ${cat.name}
                    <div class="checkmark">●</div>
                </div>
            `).join('');
        });

    // 点击选择器
    selector.addEventListener('click', () => {
        isOpen = !isOpen;
        dropdown.style.display = isOpen ? 'block' : 'none';
        selector.style.borderColor = isOpen ? '#1890ff' : '#d9d9d9';
    });

    // 点击选项
    dropdown.addEventListener('click', (e) => {
        if (e.target.closest('.option')) {
            const option = e.target.closest('.option');
            const selectedText = option.textContent.trim().replace('●', '');
            
            // 更新显示
            selector.querySelector('.placeholder').textContent = selectedText;
            selector.querySelector('.placeholder').style.color = '#333';
            
            // 关闭下拉
            isOpen = false;
            dropdown.style.display = 'none';
        }
    });
});